<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<html>

<head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="../../static/css/font.css" th:href="@{/css/font.css}">
    <link rel="stylesheet" href="../../static/css/xadmin.css" th:href="@{/css/xadmin.css}">
    <script src="../../static/js/jquery-3.2.1.min.js" type="text/javascript"
            th:src="@{/js/jquery-3.2.1.min.js}"></script>
    <script src="../../static/js/vue.js" type="text/javascript" th:src="@{/js/vue.js}"></script>
    <script src="../../static/lib/layui/layui.js" charset="utf-8" th:src="@{/lib/layui/layui.js}"></script>
    <script type="text/javascript" src="../../static/js/xadmin.js" th:src="@{/js/xadmin.js}"></script>

    <style>
        .layui-table-cell {
            height: 30px;
        }

        .x-nav {
            margin: 20px;
        }

        .layui-table-cell.laytable-cell-1-0-6 {
            margin: 0px 0px;
        }
    </style>
</head>
<body>
<div class="x-nav">

    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>


<script type="text/html" id="barDemo">
    <button type="button" class="layui-btn" onclick="x_admin_show('添加考生','/examinee/examineeAdd',600,500)">增加</button>
    <a class="layui-btn delAll_btn layui-btn-danger layui-btn-xs" lay-event="delAll">批量删除</a>
</script>


<table class="layui-hide" id="data" lay-filter="data"></table>
</body>

<script th:inline="none">
    function loadData() {
        layui.use('table', function () {
            let table = layui.table;
            table.render({
                elem: '#data',  //绑定table容器
                url: '/user/kSList',  //请求后端的地址
                limit: 6, //默认值10
                id: 'userListTable',
                toolbar: "#barDemo",
                defaultToolbar: ['filter', 'print', 'exports'],
                //显示的内容
                cols: [ // thymeleaf中，[[]]不能连写，必须换行像如下写法，否则会被解析为内敛表达式
                    [
                        //field:就是成员变量的名字 sort:是否显示排序按钮
                        {fixed: 'left', type: 'checkbox'},
                        {field: 'userId', width: 100, title: '用户编号', sort: true},
                        {field: 'name', width: 200, height: 30, title: '姓名', sort: true},
                        {field: 'sex', width: 200, title: '性别', sort: true},
                        {field: 'username', width: 200, title: '用户名', sort: true},
                        {field: 'phone', width: 200, title: '电话', sort: true},
                        {
                            field: '', width: 200, title: '操作', templet: function (data) {
                                return '<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="updateOne(this)">\n' +
                                    '    <i class="layui-icon">&#xe642;</i>\n' +
                                    '  </button>' +
                                    '&nbsp;&nbsp;&nbsp;&nbsp;' +
                                    '<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="deleteOne(this)">\n' +
                                    '    <i class="layui-icon">&#xe640;</i>\n' +
                                    '  </button>';
                            }
                        }
                    ]
                ],
                page: true, //是否开启分页
            });
            // 监听
            table.on('toolbar(data)', function (obj) {
                console.log(obj.event);
                if (obj.event == 'delAll'){
                    var checkStatus = table.checkStatus(obj.config.id);
                    data = checkStatus.data;
                    newsId = [];
                    if (data.length > 0) {
                        for (var i in data) {
                            newsId.push(data[i].userId);
                        }
                        console.log(newsId);
                        layer.confirm('确定删除选中的用户？', {icon: 3, title: '提示信息'}, function (index) {
                            $.ajax({
                                url:'/user/examineeBatchDel',
                                type:'post',
                                dataType: 'json',
                                data:{
                                    "arr":newsId.toString(),
                                },success:function (rs) {
                                    console.log(rs);
                                    if (rs.code == 200){
                                        layer.open({
                                            title: '删除考生信息'
                                            , content: '删除成功!'
                                        });
                                        loadData();
                                    }else {
                                        layer.open({
                                            title: '删除考生信息'
                                            , content: '删除失败!'
                                        });
                                    }
                                },error:function () {
                                    layer.open({
                                        title: '系统消息'
                                        , content: '服务器错误!'
                                    });
                                }
                            });
                        })
                    } else {
                        layer.msg("请选择需要删除的用户");
                    }
                }


            })
        })
    }
</script>

<script>
    function deleteOne(obj) {
        var text = $(obj).parent().parent().parent().find("td").eq(1).text();
        console.log(text);
        $.ajax({
            url: '/user/examineeDelete',
            type: 'post',
            dataType: 'json',
            data: {
                userId: text,
            }, success: function (data) {
                if (data.code == 200) {
                    layer.open({
                        title: '删除考生信息'
                        , content: '删除成功!'
                    });
                    // 清除当前这个tr
                    $(obj).parents("tr").remove();
                } else {
                    layer.open({
                        title: '删除考生信息'
                        , content: '删除失败!2333333'
                    });
                }
            }, error: function () {
                layer.open({
                    title: '系统消息'
                    , content: '服务器错误!'
                });
            }
        })
    }
</script>

<script>
    function updateOne(obj) {
        var userId = $(obj).parent().parent().parent().find("td").eq(1).text();

        x_admin_show('编辑', '/examinee/examineeEdit/' + userId, 600, 400);
    }
</script>


<!--   文档加载事件-->
<script>
    $(function () {
        loadData();
    });
</script>

</html>